import React, { Component } from 'react'
import axios from 'axios'
// https://api.github.com/search/repositories?q=react&sort=stars
export default class App extends Component {
    state = {
        items: [],
        isLoading: true
    }
    render() {
        return (
            <div>
                {
                    this.state.isLoading ? <h2>页面加载中</h2>:(
                        this.state.items.map(item => {
                            return (
                                <p key={item.id}>
                                    <a href={item.html_url}>{item.full_name}</a>
                                </p>
                            )
                            })
                    )
                }
                
            </div>
        )
    }

    async searchRepositories() {
        const { data: { items } } = await axios.get(' https://api.github.com/search/repositories', {
            params: {
                q: 'react',
                sort: 'stars'
            }
        })
        console.log(items);
        this.setState({
            items,
            isLoading: false
        })
    }
    componentDidMount() {
        this.searchRepositories()
    }
}
